/*
 * Copyright (c) 2007-2020 西安交通信息投资营运有限公司 版权所有
 * 作者:马星俊
 */

import React, {FC} from "react";
import service from "@/pages/sys/role/service";
import {SysUserModel} from "@/pages/sys/user/data";
import styles from "./Authorize.less";
import UserDetails from "@/pages/sys/user/components/Details";
import useDialog from "@/hooks/useDialog";
import useLoad from "@/hooks/useLoad";

interface MemberProps {
  /** 数据主键 */
  primaryKey?: string;
}


const Member: FC<MemberProps> = (props) => {
  const detailsOperate = useDialog();
  const {primaryKey} = props;
  const {data: members = []} = useLoad<SysUserModel[]>({
    isLoad: Boolean(primaryKey),
    onLoad: () => service.selectMapUserList(primaryKey)
  }, [primaryKey]);

  return (
    <div style={{margin: '0 24px 0 0'}}>
      {members.length ? (
        <ul className={styles.uiK}>
          {members.map(p => <li className={styles.liCard} key={p.id}
                                onDoubleClick={() => detailsOperate.show({id: p.id})}>{p.name}</li>)}
        </ul>) : (
        <div className={`${styles.alert} ${styles.warning} ${styles.margin} ${styles.padding}`}>未包含任何用户</div>)}
      <UserDetails {...detailsOperate}/>
    </div>
  )
}

export default Member;
